// 个人信息页面  
// 1. 获取个人信息
async function getUserInfo() {
    const res = await reqGetUserInfo()
    let { data: { nickname, email, username, id } } = res.data
    console.log(id)
    // console.log(nickname, email, username);
    // 将获取到的数据 赋值给三个输入框的val值 + 隐藏的id的输入框
    $('.layui-card input[name=username]').val(username)
    $('.layui-card input[name=nickname]').val(nickname)
    $('.layui-card input[name=email]').val(email)
    $('.layui-card input[name=id]').val(id)
}
getUserInfo()

// 2. 修改用户信息 
// 2.1 规则的校验

// 2.2 发送请求 更改用户信息
$('.layui-form').on('submit', async (e) => {
    e.preventDefault()
    // 接口中需要3个字段, id nickname  email
    // 准备数据
    const obj = {
        nickname: $('.layui-card input[name=nickname]').val(),
        email: $('.layui-card input[name=email]').val(),
        id: $('.layui-card input[name=id]').val()
    }
    // console.log(obj);
    // 发送请求
    const res = await reqPostUpdateUserInfo(obj)
    console.log(res)
    // 在小的html文件中调用最外面这个大的html方法, 调用成功了,但是视图更新, 因为当前userInfo页面没有对应的dom元素
    // 在这个位置手动触发这个方法
    // getUserInfoFn() - 大的html页面中的方法,这个方法中就是设置dom内容的-直接调用这个函数会报错, 原因是在小html页面调这个方法调不到
    // console.log(window.parent)  // 上一层html的window
    window.parent.getUserInfoFn()
})

// 3. 重置功能 重置按钮也要阻止默认行为
$('.my-reset').on('click', (e) => {
    e.preventDefault()
    // 将输入框的值恢复成获取到的数据
    getUserInfo()
})